<template>
  <div class="shop-header">
    <el-row>
      <el-col>
        <user-index/>
      </el-col>
    </el-row>
    <el-row>
      <el-col>
        <searchbar/>
      </el-col>
    </el-row>
  </div>
</template>

<script>

import UserIndex from './before/index'
import searchbar from "./search/searchbar";

export default {
  name: "BeforeHeader",
  components: {
    UserIndex,
    searchbar
  }
}
</script>

<!--抽取的主页header-->
<!--
> 是后代选择器 作用于子代标签
& 是串联选择器 作用于同一个标签
-->
<style lang="scss" scoped>
//.shop-header {
//  //height: 80px;
//
//  > .el-row:nth-child(1) {
//    width: 1200px;
//    margin: 0 auto;
//  }
//
//  //> .el-row:nth-child(2) {
//  //  width: 1200px;
//  //  margin: 0 auto;
//  //  background: #fff;
//  //}
//
//
//}

//.shop-header{
//  height: 80px;
//  background-color: #31BBAC;
//  width: 100%;
//  padding: 0;
//  .el-row:nth-child(1){
//    width: 1200px;
//    margin: 0 auto;
//
//    height: 40px;
//    line-height: 40px;
//  }
//}
//.shop-header {
//
//
//  // 最上面
//  > .el-row:nth-child(1) {
//    width: 1190px;
//    margin: 0 auto;
//    z-index: 9999;
//    height: 40px;
//    line-height: 40px;
//  }
//
//  // 搜索
//  >.el-row:nth-child(2){
//    background: #fff;
//    .search{
//      width: 1190px;
//      margin: 0 auto;
//    }
//  }
//
//  // 主体
//  > .el-main {
//    overflow: unset;
//  }
//}

</style>
